<html>
<head>
	<title>Passenger Details - H!Indonesia</title>
	<script type="text/javascript" src="script/jquery-1.9.1.js"></script>
	<script type="text/javascript" src="script/plugins/jquery.tipsy.js"></script>
	<script type="text/javascript" src="script/common.js"></script>
	<link rel="stylesheet" type="text/css" href="css/960.css" />
	<link rel="stylesheet" type="text/css" href="css/style.css" />
	<link rel="stylesheet" type="text/css" href="css/plugins/tipsy.css" />
</head>
<body>
	<div class="container_24">
		<header>
			<div class="header-wrapper clearfix">
				<div id="top-bar" class="grid_24">
					<div class="login-box">
						<span class="sign-up-left">
							<a href="#">Sign Up</a>
						</span>
						<span class="separate-or">
						or
						</span>
						<span class="sign-in-right">
							<a href="#">Log In</a>
						</span>
					</div>
					<div class="shop-cart">
						<a href="#" title="Your cart is empty"><i class="icon-shopping-cart"></i><sup>0</sup></a>
					</div>
					<div class="search-box">
						<button class="search-trigger"></button>
						<input type="text" id="search_keyword" placeholder="search">
					</div>
				</div>
				<div id="site-logo" class="grid_7">
					<a href="#">
						<img src="img/assets/logo.png" alt="H!Indonesia | Online Tourism Information and Booking Ticket"> 
					</a>
				</div>
				<nav id="top-nav" class="grid_17">
					<ul id="menu">
						<li><a href="#">home</a></li>
						<li class="drop"><a href="#">book</a>
							<ul>
								<li><a href="#">flight</a></li>
								<li><a href="#">hotel</a></li>
							</ul>
						</li>
						<li><a href="#">plan</a></li>
						<li><a href="#">explore</a></li>
						<li><a href="#">news</a></li>
						<li><a href="#">travel notes</a></li>
						<li><a href="#">travel guide</a></li>
						<li><a href="#">faq</a></li>
						<li><a href="#">about us</a></li>
					</ul>
				</nav>
			</div>
		</header>
		<section class="main-content grid_19">
			<div class="flight-detail">
				<div class="wrap-flight-detail">
					<div class="depart">
						<div class="head-depart">
							<img src="img/static/aa.gif" alt=""/>
							<span class="in">Depart Flight</span>
							 &#8226; Mon, 6 May 2013
						</div>
						<div class="detail-depart">
							<ul class="clearfix">
								<li><span class="plane-code">JT-152</span></li>
								<li>
									<strong class="single">CGK</strong>
									<img src="img/icons/icon-flight-big.png" alt="to">
									<strong>SIN</strong>
								</li>
								<li class="date">
									<strong>06:15 - 09:00</strong>
									<span>1 Hour 45 Minutes</span>
								</li>
								<li class="price">
									<strong class="currency" rel="400000">IDR 400.000,00</strong>
									<span>per person</span>
								</li>
							</ul>
							<p class="place"><i class="icon-map-marker"></i>SOEKARNO-HATTA, DKI Jakarta (CGK) <img src="img/icons/icon-arrow-to.png" alt="to"> SINGAPORE,  (SIN)</p>
							<p class="user"><i class="icon-user"></i>1 Adult x <span class="currency" rel="400000">IDR 400.000,00</span></p>
						</div>
					</div>
					<!-- <div class="return">
					</div> -->
					<div class="total-flight">
	                    <span class="tot">TOTAL <em><sup>*</sup>Before tax &amp; service charge</em></span> 
	                    <strong class="price"><span class="currency" rel="400000">IDR 400.000,00</span></strong>
					</div>
				</div>
				<div class="my-order">
			        <h2>Passenger Details</h2>
			        <div class="wrap-passenger">
			            <div class="desc">
	                        <p>
	                            We need to gather passenger information for you and anyone travelling with you. The names you provide must match the names on the passenger's passport (for international travel) or other acceptable ID (for domestic travel, e.g. driver's licence), which must be presented at check-in. Please provide a mobile phone number for the primary passenger.
	                        </p>
	                    </div>
	                    <div class="already-login">
	                    	<h4>Hi-Indonesia.com Member Login</h4>
	                    	<p>If you already have Hi-Indonesia.com account, you can login to make this process faster.<a class="button login" title="Login">Login</a></p>
	                    </div>
	                    <div class="form">
	                    	<form method="post">
	                    		<div class="contact-person">
	                    			<h4>Contact Person Information</h4>
	                    			<div class="cols clearfix">
				                        <p class="left">
				                            <label for="title-ci">Title<span class="note-required">*</span></label><br>
				                            <select id="title-ci" name="title-ci" tabindex="">
				                            	<option value="">Select Title</option>
				                                <option value="Mr">Mr.</option>
				                                <option value="Mrs">Mrs.</option>
				                                <option value="Ms">Ms.</option>
				                            </select>
				                        </p>
				                    </div>
				                    <div class="cols clearfix">
				                        <p class="left grid_8">
				                            <label for="first-name-ci">First Name<span class="note-required">*</span></label><br>
				                            <input type="text" id="first-name-ci" name="first-name-ci" value="">
				                        </p>
				                         <p class="right grid_8 prefix_1">
				                            <label for="last-name-ci">Last Name</label><br>
				                            <input type="text" id="last-name-ci" name="last-name-ci" value="">
				                        </p>
				                    </div>
				                    <div class="cols clearfix">
				                        <p class="left grid_8">
											<label for="phone-primary">Phone Number
												<span tooltip="Format: (e.g. +6286665636)" class="star-notice"></span>
												<span class="note-required">*</span>
											</label><br>
											<input type="text" id="phone-primary" name="phone-primary" value="+62">
											<span class="help-block">Format phone number must begin with your country code.<br> Example: +6221030293. 
												<a class="search-code">Search Country Code</a>
											</span>
				                        </p>
										<p class="right grid_8 prefix_1">
				                            <label for="phone-other">Other Phone Number
												<span tooltip="Format: (e.g. +6286665636)" class="star-notice"></span>
											</label><br>
				                            <input type="text" id="phone-other" name="phone-other" value="+62">
				                        </p>
				                    </div>
	                    		</div>
	                    		<div class="adult-passenger">
	                    			<h4>Adult Passenger <span>( Primary )</span></h4>
	                    			<div class="cols clearfix">
				                        <p class="left grid_8">
				                            <label for="title-a1">Title<span class="note-required">*</span></label><br>
				                            <select id="title-a1" name="title-a1">
				                            	<option value="">Select Title</option>
				                                <option value="Mr">Mr.</option>
				                                <option value="Mrs">Mrs.</option>
				                                <option value="Ms">Ms.</option>
				                            </select>
				                        </p>
				                        <p class="right grid_8 prefix_1">
				                            <label for="id-a1">ID Card Number (KTP /SIM /Student Card)<span tooltip="Must be in digit" class="star-notice"></span></label><br>
				                            <input type="text" id="id-a1" name="id-a1" value="">
				                        </p>
				                    </div>
				                    <div class="cols clearfix">
				                        <p class="left grid_8">
				                            <label for="first-name">First Name<span class="note-required">*</span></label><br>
				                            <input type="text" id="first-name" name="first-name" value="">
				                        </p>
				                         <p class="right grid_8 prefix_1">
				                            <label for="last-name">Last Name</label><br>
				                            <input type="text" id="last-name" name="last-name" value="">
				                        </p>
				                    </div>
				                    <div class="continue clearfix">
	                                    <a href="#" id="button-ec">Add to shopping cart</a>
	                                    <input type="submit" value="Pay Now" id="continue-book" class="button">
	                                </div>
	                    		</div>	
	                    	</form>
	                    </div>
			        </div>
				</div>
			</div>
		</section>
		<section class="sidebar-right grid_5">
			<div class="ads-space">
				<a href="#"><img src="img/static/ads-denpasar.png" alt="Ads space"></a>
				<a href="#"><img src="img/static/ads-lombok.png" alt="Ads space"></a>
				<a href="#"><img src="img/static/ads-google.png" alt="Ads space"></a>
			</div>
		</section>
		<footer>
			<nav class="clearfix">
				<ul class="bottom-nav grid_24">
		          <li><a href="#">About Us</a></li>
		          <li><a href="#">FAQ</a></li>
		          <li><a href="#">Contact Us</a></li>
		          <li><a href="#">Jobs</a></li>
		          <li><a href="#">Our Partner</a></li>
		          <li><a href="#">Press</a></li>
		        </ul>
	        </nav>
	        <section class="footer">
	        	<div class="footer-wrapper clearfix">
		        	<div class="footer-left grid_12">
		        		<ul>
		        			<li><a href="#">Terms of service</a></li>
		        			<li><a href="#">Privacy</a></li>
		        			<li><a href="#">Feedback & support</a></li>
		        		</ul>
		        		<div class="copyright">
		        			&copy; 2013 Hi-Indonesia. All rights reserved.
		        		</div>
		        	</div>
		        	<div class="footer-right grid_12">
		        		<ul>
		        			<li><a href="#">English</a></li>
		        			<li><a href="#">Bahasa</a></li>
		        		</ul>
		        	</div>
	        	</div>
	        </section>
		</footer>
	</div> 
</body>
</html>